<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/html" xmlns:v-bind="http://www.w3.org/1999/xhtml">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <script src="js/vue.js"></script>
</head>
<body>


<div id="app">
  <input v-model="username">
  {{ username }}
  <br>
  <input v-model="password">
  <!--插值表达式-->
  {{ password }}
  <br>
  输入网址:<input v-model="url">
  <a v-bind:href="url">点击</a>
  <br>
  <input type="button" value="按钮" @click="show()">
  <br>
  <div v-if="count == 1">div1</div>
  <div v-if="count == 2">div2</div>
  <div v-if="count == 3">div3</div>
</div>


<script>
  new Vue({
    el: "#app",
    data() {
      return {
        username: "",
        password: "",
        url: "",
        count: 3
      }
    },
    methods: {
      show() {
        alert("我被点了!");
      }
    },
    mounted(){
      alert("mounted")
    },
    created(){
      alert("created")
    }
  });
</script>

</body>
</html>